<template>
  <div class="wrap">
    <van-notice-bar scrollable :text="warnMsg" left-icon="volume-o" />
    <p class="title">提交银行卡信息</p>
    <van-panel title="身份信息">
      <div class="list-item">
        <span class="name">用户名:</span>
        <span v-text="username"></span>
      </div>
      <div class="list-item">
        <span class="name">手机号:</span>
        <span v-text="mobile"></span>
      </div>
      <div class="list-item">
        <span class="name">身份证号:</span>
        <span v-text="idCard"></span>
      </div>
    </van-panel>
      <van-panel title="银行卡信息" style="margin-top:10px">
        <van-field v-model.trim="bank"  clearable label="开户行:" placeholder="请输入开户行" />
        <van-field v-model.trim="address" clearable label="开户行地址:" placeholder="请输入开户行地址" />
        <van-field v-model.trim="cardNo"  maxlength="25" clearable label="卡号:" placeholder="请输入卡号" />
      </van-panel>
    <van-divider style="font-size:12px">请务必确认所输入信息系本人银行卡信息且准确无误，若因输入错误造成的资金损失，由本人自行承担</van-divider>
    <div class="btn" @click="handleCardInfo">再次申请</div>
  </div>
</template>
<script>
import {
  NoticeBar,
  Panel,
  Field,
  DropdownMenu,
  DropdownItem,
  Divider,
  RadioGroup,
} from "vant";
import {getData} from "../utils/api";
export default {
  name: "bankCardInfo",
  data() {
    return {
      warnMsg:`${sessionStorage.getItem("name")}，您好！请尽快完成银行卡绑定，方便我们线下给您打款`,
      username: sessionStorage.getItem("name"),
      idCard: sessionStorage.getItem("idCard"),
      mobile: sessionStorage.getItem("mobile"),
      bank:sessionStorage.getItem("againBank"),
      address:sessionStorage.getItem("againBankAddress"),
      cardNo:sessionStorage.getItem("againBankNum")  
    };
  },
    methods:{
           handleCardInfo(){
      // //添加新银行卡
      // getData({
      //   method:"bindBankCard",
      //   dataBody:{
      //    cardHolder: sessionStorage.getItem("name"),
      //    bankCardNo:this.cardNo,
      //    affiliatedBank:this.bank,
      //    bankName:this.address,
      //    bankCardType: 3,
      //    currency: "1" // 默认1 人民币
      //   }
      // })
      //司机绑定信息
      getData({
        method:'bindShortDriver',
        dataBody:{
          driverName:sessionStorage.getItem("name"),
          identityNo:sessionStorage.getItem("idCard"),
          bankCardNo:this.cardNo,
          openCardBankName:this.address,
          openCardBank:this.bank,
          companyId:sessionStorage.getItem("companyId"),
          mobile:this.mobile
        }
      }).then((res)=>{
        if(res.data.result.code!=0){
          // Dialog.alert({
          //   message: res.data.result.msg
          // });
        if (res.data.result.msg == "请求数据丢失，请重新登陆") {
            alert(res.data.result.msg)
            this.$router.push({ path: "/" });
        } else {
            alert(res.data.result.msg);
        }
        }else{
          this.$router.push({ path: "/bindSuccess" });
        }
      })
    }
  },
  mounted() {
     
  },

};
</script>
<style scoped>
.wrap {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  overflow-y: auto;
  background-color: rgb(248, 248, 248);
}
.title {
  padding: 10px 16px;
  color: #323233;
  font-size: 14px;
  margin: 0;
  color: rgba(69, 90, 100, 0.6);
}
.btn {
  margin: auto;
  width: 120px;
  height: 44px;
  border-radius: 22px;
  background: #0082d7;
  text-align: center;
  line-height: 44px;
  color: #fff;
  margin-top: 22px;
  box-shadow: 0px 0px 12px 0px rgba(23, 153, 238, 1);
}
.van-cell__title {
  color: #0082d7;
}
.addcard{
  text-align: right;
   color: #0082d7;
   font-size: 14px;
   padding:10px 16px
}
.list-item {
  color: #323233;
  font-size: 14px;
  line-height: 24px;
  height: 24px;
  padding: 10px 0px;
  margin-left: 16px;
  border-bottom: 1px solid #f4f4f4;
}
.name {
  display: inline-block;
  width: 90px;
}
</style>